//# sourceURL=http://uMapApp/UI/Pop
define([
    "mhjs/mhjs",
    "uMap/uMap"
], function (
    mhjs,
    uMap
) {

    function Pop(option) {

        var _this = this;
        _this.isOpened = false;

        _this.ui = {
            popwin : new mhjs.Div({"class": "popwin"}),
            wrap   : new mhjs.Div({"class": "wrap"}),
            title  : new mhjs.Div({"class": "title"}),
            content: new mhjs.Div({"class": "content"}),
            close  : new mhjs.Div({"class": "close"}),
            arrow  : new mhjs.Div({"class": "arrow"})
        };

        _this.ui.wrap.append(_this.ui.title);
        _this.ui.wrap.append(_this.ui.content);
        _this.ui.popwin.append(_this.ui.wrap);
        _this.ui.popwin.append(_this.ui.close);
        _this.ui.popwin.append(_this.ui.arrow);

        mhjs.Div.call(_this, option);
        _this.addClass("pop");

        _this.append(_this.ui.popwin);


        _this.ui.close.on("click", function () {
            _this.close();
        });

        _this.popListener = new uMap.ScreenPositionListener({
                "listener": function (screenPosition) {
                    _this.css({
                        left: screenPosition.x,
                        top : screenPosition.y
                    });
                },
                "earth"   : _this.app.earth
            }
        );


    }

    var _class = Pop;
    mhjs.Inherit(_class, mhjs.Div);


    Object.defineProperties(_class.prototype, {
        "title"   : {
            get: function () {
                return this._title;
            },
            set: function (value) {
                this._title = value;
                this.ui.title.text(value);
            }
        },
        "content" : {
            get: function () {
                return this._content;
            },
            set: function (contentDom) {
                this._content = contentDom;
                this.ui.content.empty();
                this.ui.content.append(contentDom);
            }
        },
        "position": {
            get: function () {
                return this._position;
            },
            set: function (value) {
                this._position = new uMap.Position(value);
                this.popListener.position = this._position;
            }
        },
        "open"    : {
            value: function (stopPropagation) {
                var _this = this;
                _this.popListener.start();
                _this.isOpened = true;
                _this.addClass("open");

                stopPropagation !== false && _this.trigger("open");
                stopPropagation !== false && _this.trigger("toggle");
            }
        },
        "close"   : {
            value: function (stopPropagation) {
                var _this = this;
                _this.isOpened = false;
                _this.removeClass("open");
                _this.popListener.stop();

                stopPropagation !== false && _this.trigger("close");
                stopPropagation !== false && _this.trigger("toggle");
            }
        },
        "toggle"  : {
            value: function (stopPropagation) {
                var _this = this;
                if (_this.isOpened) {
                    _this.close(stopPropagation);
                } else {
                    _this.open(stopPropagation);
                }
            }
        }
    });

    return _class;

});